<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>考试系统主页</title>
<%@include file="../core/head.jsp"%>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="stylesheet" href="${ctx}/css/core.css" type="text/css">
<link rel="stylesheet" href="${ctx}/css/exam.css" type="text/css">
<link rel="stylesheet" href="${ctx}/css/buttons.css" type="text/css">

<script language="javascript" type="text/javascript"> 
var interval = 1000; 
function ShowCountDown(year,month,day,divname) { 
	var now = new Date(); 
	var endDate = new Date(year, month-1, day); 
	var leftTime=endDate.getTime()-now.getTime(); 
	var leftsecond = parseInt(leftTime/1000); 
	var day1=Math.floor(leftsecond/(60*60*24)); 
	var hour=Math.floor((leftsecond-day1*24*60*60)/3600); 
	var minute=Math.floor((leftsecond-day1*24*60*60-hour*3600)/60); 
	var second=Math.floor(leftsecond-day1*24*60*60-hour*3600-minute*60); 
	//var cc = document.getElementById(divname); 
	//cc.innerHTML = "距离"+year+"年"+month+"月"+day+"日还有："+day1+"天"+hour+"小时"+minute+"分"+second+"秒"; 
	$("#day").text(day1);
	
	$("#hms").text(format(hour)+"小时"+format(minute)+"分"+format(second)+"秒");
	function format(num){
		return num<10?("0"+num):num;
	}
} 
$(function(){
	$("#tagdate").text("2014年03月22日");
	ShowCountDown(2014,3,22,'divdown1');
	window.setInterval(function(){ShowCountDown(2014,3,22,'divdown1');}, interval); 
	
}
		
);
</script> 
<style type="text/css">
.cutTime {
	margin: 10px;
	padding: 15px;
	width:160px;
	height:200px;
	font-family: '微软雅黑';
	border-radius: 15px 15px 15px 15px;
	-moz-border-radius: 15px 15px 15px 15px;
	-webkit-border-radius: 15px 15px 15px 15px;
}

.cutTime h3 {
	font-size: 14px;
	color:#999;
	
}

.cutTime h2 {
	color: orange;
	font-size: 14px;
	
}

.cutTime h1 {
	font-size: 20px;
	color: red;
	line-height: 100px;
	vertical-align: middle;
	font-weight:normal;
}

.cutTime #day {
	font-size:80px;
	font-weight:bold;
	color: red;
}
.notichead{
	 text-align: left; 
	 font-family: '微软雅黑';
	 font-size: 14px;
}
.noticmsg{
	margin: 10px;
	padding: 15px;	
	text-align: left;
}
.noticmsg ul{
	margin: 10px 0 0 24px;
	
}
.noticmsg li{
	list-style-type:none;
	color: #666;
	line-height: 26px;
}

</style>
    <script type="text/javascript" src="${ctx }/js/FusionCharts.js"></script>
	
    <script type="text/javascript">
	 	
	    $(function(){
	    	  var dataxml =  "<chart caption='答题曲线'   yAxisName='次数' showValues='0'"+
	    			 " palette='2' shownames='1' legendBorderAlpha='0' useRoundEdges='1' numdivlines='9'"+
	    			 " lineThickness='2' anchorRadius='3' anchorBgAlpha='50' showAlternateVGridColor='1'"+
	    			 " numVisiblePlot='12' labelStep='5' decimalPrecision='0' formatNumberScale='0' baseFont='Arial' baseFontSize='12'>"+
	    	  
	    			" <categories>"+
	    			 " <category label='A' /> "+
	    			 " <category label='B' /> "+
	    			 " <category label='C' /> "+
	    			 " <category label='D' /> "+
	    			 " <category label='E' /> "+
	    			 " <category label='F' /> "+
	    			 " <category label='G' /> "+
	    			 " </categories>"+
	    			 " <dataset seriesName='正确率'>"+
	    			 " 	   <set value='12' /> "+
	    			 " 	   <set value='43' /> "+
	    			 " 	   <set value='6' /> "+
	    			 " 	   <set value='24' /> "+
	    			 " 	   <set value='22' /> "+
	    			 " 	   <set value='23' /> "+
	    			 " 	   <set value='16' /> "+
	    			 "   </dataset>"+
	    			 " <dataset seriesName='错误率'>"+
	    			 " 	   <set value='122' /> "+
	    			 " 	   <set value='33' /> "+
	    			 " 	   <set value='0' /> "+
	    			 " 	   <set value='24' /> "+
	    			 " 	   <set value='16' /> "+
	    			 " 	   <set value='34' /> "+
	    			 " 	   <set value='16' /> "+
	    			 "   </dataset>"+
	    			 
	    			 "  </chart>";

	          var myChart = new FusionCharts("${ctx}/charts/ScrollLine2D.swf", "myChartId", "600", 200);    
			  myChart.setDataXML(dataxml);    
			  myChart.render("chartdiv");
	     });
    </script> 
</head>

<body>
<%@include file="../exam/top.jsp"%>
	<div class="menuPanel radius width center">
	 
	
		<div style="height: 300px; width:90%; margin:20px auto;vertical-align: middle; border-bottom: 1px solid #ccc;  " class="radius">
			 		<div class="clear " ></div>
			 
			 		<div class="noticmsg left">
			 		<!-- 
			 			<div class="notichead">您好${user.nickname }以下是您的答题曲线：</div>
			 		 -->
			 			<div id="chartdiv" >
				 			 
			 			</div>
			 		
			 		</div>
			 	 
			 	
			 	 
			 		<div class="shadow cutTime right"  >
						<h3><span >距离下次考试时间</span><br/><span id="tagdate"></span>还有</h3>
						<h1><span id="day">100</span><span>天</span></h1>
						<h2><span id="hms"></span></h2>			 	
			 			 
			 		</div>	 
			 	
			 	 
		</div>
		
		<div style="margin: 10px;">
			<shiro:hasRole name="admin">
					<a href="${ctx}/exam/paperStore.action" class="button blue  menuBut">题库管理</a>
			</shiro:hasRole>
			 
			<a href="${ctx}/exam/startExam.action" class="button green  menuBut">开始答题</a>
			<a href="${ctx}/exam/myWrongs.action" class="button gray  menuBut">我的错题</a>
			<a href="${ctx}/exam/searchQuestions.action" class="button orange  menuBut">试题查询</a>
		</div>	
		 
	</div>
 
<%@include file="../core/bottom.jsp"%>
</body>
</html>
